<template>
  <div class="pad-r-20">
    <div class="lh-14 pull-right">
      <template v-if="mode == 'design'">
        <el-link :underline="false">配置视图</el-link>
        <el-link :underline="false" class="mar-l-10">添加部件</el-link>
        <el-link :underline="false" @click="changeMode('browse')" class="mar-l-10">保存</el-link>
        <el-link :underline="false" @click="changeMode('browse')" class="mar-l-10">退出</el-link>
      </template>
      <template v-if="mode == 'browse'">
        <el-link :underline="false" class="mar-l-10">退出</el-link>
      </template>
    </div>
  </div>
</template>
<script>
export default {
  data(){
    return {
      mode: 'design'
    }
  },
  methods: {
    changeMode(mode){
      this.mode = mode;
    }
  }
}
</script>
<style lang="scss" scoped>
.el-link{
  display: block;
  float: left;
  padding: 20px 0;
}
</style>